<template>
  <div>
    <el-table :data="approvalList" style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column prop="processId" label="序号" width="180" sortable />
      <el-table-column prop="processName" label="审批类型" width="180" sortable />
      <el-table-column prop="username" label="申请人" width="180" sortable />
      <el-table-column prop="procCurrNodeUserName" label="当前审批人" sortable />
      <el-table-column prop="procApplyTime" label="审批发起时间" sortable />
      <el-table-column prop="processState" label="审批状态" sortable>
        <template #default="scope">
          <template v-if="scope.row.processState === 0">已提交</template>
          <template v-else-if='scope.row.processState === 1'>审批中</template>
          <template v-else-if='scope.row.processState === 2'>审批通过</template>
          <template v-else-if='scope.row.processState === 3'>审批不通过</template>
          <template v-else-if='scope.row.processState === 4'>撤销</template>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="操作">
        <template #default="scope">
          <el-button size="small" @click="handledit(scope.$index, scope.row)" plain>查看</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { useRouter } from 'vue-router';
const router = useRouter()
defineProps(["approvalList"]);
const multipleSelection = ref<any[]>([])
const handledit = (index: number, row: any) => {
  router.push({
    path: "/home/approval/Approvaldetail",
    query: {
      id: row.processId,
    },
  });
};

const handleSelectionChange = (val: any[]) => {
  multipleSelection.value = val
}
</script>

<style scoped></style>
